import React, {Component} from "react";
import {
    View,
    Text,
    StyleSheet
} from "react-native";
import ListView from "../components/ListView";
import RefreshView from "../components/RefreshView";


export default class ListViewPage extends Component {
    constructor() {
        super();
        this.state = {
            data: [],
            refreshing: false,
            loading: false
        }
    }

    componentWillMount(){
        this.setState({refreshing:true});
    }

    _onRefresh=()=>{
        var temp = [];
        for (let i = 0; i < 5; i++) {
            temp.push(i);
        }
        this.setState({
            data: temp,
            refreshing: false
        });
    };
    _onLoad=()=>{
        var temp = [];
        for (let i = 0; i < this.state.data.length+5; i++) {
            temp.push(i);
        }
        this.setState({
            data:temp,
            loading: false
        });
    };

    _renderItem =(index, item)=>{
        return (
            <View
                key={index}
                style={styles.test}
                activeOpacity={0.8}
                onPress={() => {
                    console.log("这是" + item);
                }}
            >
                <Text style={{flex: 1}}>这是{item}</Text>
                <Text>==={item}</Text>
            </View>
        );
    };
    render() {
        return (
            <RefreshView
                refreshing={this.state.refreshing}
                loading={this.state.loading}
                onRefresh={this._onRefresh}
                onLoad={this._onLoad}
            >
                <ListView
                    style={{height: "96%", backgroundColor: "#0f0"}}
                    data={this.state.data}
                    isPadding={[true, true, true, true]}
                    dividerHeight={10}
                    renderItem={this._renderItem}
                />
            </RefreshView>)
    }
}

const styles = StyleSheet.create({
    test: {
        display: "flex",
        flexDirection: "row",
        borderWidth: 2,
        borderColor: "#000",
        backgroundColor: "#ff0000"
    }
});
